import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import bus from "./utils/bus/bus"
import qfSubMenu from "qf-sub-menu";
Vue.use(qfSubMenu)

Vue.prototype.$bus=bus
import "./assets/styles/base.less" //引入基本样式
import "./assets/styles/el.reset.less" //引入设置在全局上的样式 
// Vue.config.productionTip = false;
Vue.use(ElementUI);


//使用阿里字体图标  symbol  
//手动创建script标签，然后添加到页面中
let script = document.createElement("script")
script.src = "//at.alicdn.com/t/font_2694199_vfl1i6i7mde.js"
document.documentElement.appendChild(script)

//路由守卫=>钩子函数beforeEach
//判断用户是否登录 如果登录  使用next()放行  没有登陆  跳回登陆页面
//如何判断用户是否登陆
// localStorage中是否存在token (判断此依据)


//要把用户菜单获取的逻辑放在此处，因为刷新页面菜单
router.beforeEach((to, from, next) => { //全局前置钩子
  //to 目标对象
  //from 原路经对象
  //next 调用了next 组件才能渲染
  // next()
  let token = localStorage.getItem("app-token") || "";
  if (!token) {  //如果没有token
    //没有登 入的情况下，只能访间login页面，其他页面一律不能访问,访问 了就跳转 回到1ogin
    //没有登入的情况下是可以访间login页面的
    if (to.path === "/login") {
      next()
    } else {
      //访问其它页面 直接跳回到login页面
      next({ path: "/login" })
    }
  } else {
    // next()
    //已经登入的情况
   
    //判断用户菜单有没有生成;
    if (store.state.sideMenu.length === 0) {
      //没有生成
      console.log(1231);
      store.dispatch("FETCH_MENU_LIST")
        .then(() => {
          next({ path: to.path })
          ///这里要注意, next里面要传参数即要进入的页面的路由信息，因为next传参数后，当前要进入的路由会被废止，转而进入参数对应的路由，虽然是同一个路由，这么做主要是为了确保addRoutes生效了。
        })
    } else {
      next()
    }
  }
})

//全局后置钩子
//已经进入页面没有必要使用next()放行
router.afterEach(function(to,from){
  //通过to.matched 中匹配到的数据，来完成面包屑的功能
  // console.log(to.matched);
  let breadCrumb =[...to.matched] //展开到一个新数组中（因为是引用数据类型，修改可能会带来问题）
  //因为当前项目匹配到的的第0项，是个空字符串，需要删掉
  breadCrumb.splice(0,1)//删除第0项，数量为1，会返回新数组
// console.log(breadCrumb);
//将breadCrumb存到vuex的state中
store.commit("SET_BREADCRUMB",breadCrumb)

} )


new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");
